body{
    margin: 0 auto;
    width: 100vw;
    background-color: rgb(33, 43, 70);
}
.header{
        display: flex;
        justify-content: space-between;
        padding: 0 7vw 0 7vw;
        background-color: rgb(111, 171, 211);

}
.zi{
    font-size: 4vw;
    color: rgb(15, 15, 49);
}
span{
    font-size: 4vw;
    padding-bottom: 1vw;
}
.passage p{
    width: 88vw;
    border-top: 1px solid rgb(180, 175, 175);
    border-bottom: 1px solid rgb(179, 175, 175);
    font-size: 2.5vw;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: rgba(236, 236, 236, 0.938);
    margin: 2.5vw auto;
    padding: 1.5vw 0 1.5vw 0;
}
/*前三*/
.top{
    display: flex;
    justify-content: space-around;
    border-bottom: 2px solid rgb(94, 95, 150);
    padding-bottom: 2.5vw;
    margin: 0 4vw 0 4vw;
}
.t1 img{
    width: 25vw;
}
.t2 img{
    width: 20vw;
}
.t3 img{
    width: 20vw;
}
 span{
    display: flex;
    flex-direction: column;
    text-align: center;
    font-size: 2.5vw;
    color: white;
}
.tou2,.tou3{
    background-color: rgb(179, 58, 58);
    width: 10vw;
    margin-left: 5.5vw;
    border-radius: 1vw;
    box-shadow: 2px 2px 2px rgb(56, 12, 12);
}
.tou1{
    background-color: rgb(179, 58, 58);
    box-shadow: 2px 2px 2px rgb(56, 12, 12);
    width: 10vw;
    border-radius: 1vw;
    margin-left: 7vw;
}
/*前三*/

/*中间*/
.mid{
    margin-top: 3vw;
}
.m1{
    display: flex;
    flex-direction: row;
    background-color: rgb(13, 15, 37);
    border-radius: 2.5vw;
    box-shadow:0.5vw 0.5vw 0.5vw rgb(159, 193, 221);
}
.pic img{
    width: 20vw;
    height: 20vw;
    margin: 1vw 0 0 2.5vw
}
.pop{
    font-size: 1.5vw;
    color: white;
    margin-left: 4vw;
}
.num{
    color: white;
    margin:3.5vw 0 0 1vw;
    font-size: 3vw;
}
.pop{
    margin-top: 10vw;
}
.tou4{
    background-color: rgb(179, 58, 58);
    box-shadow: 2px 2px 2px rgb(128, 146, 204);
    width: 10vw;
    height: 4vw;
    border-radius: 1vw;
    margin: 10vw 0 0 35vw;
}
.m2{
    display: flex;
    flex-direction: row;
    background-color: rgb(13, 15, 37);
    border-radius: 2.5vw;
    box-shadow:0.5vw 0.5vw 0.5vw rgb(159, 193, 221);
    margin-top: 4vw;
}
/*中间*/

/*最后*/
.under{
    background-color: rgb(13, 15, 37);
    border-radius: 2.5vw;
    margin-top: 10vw;
}
.u1{
    display: flex;
    justify-content: space-around;
    margin-top: 5vw;
}
.un1{
    display: flex;
    flex-direction: column;
    text-align: center;
    color: white;
 
}
.a{
    font-size: 4vw;
}
.b img{
    width: 20vw;
    height: 20vw;
    box-shadow: 0.3vw 0.3vw 0.3vw rgb(151, 150, 150);
}

.c{
    font-size: 2vw;
}
.d{
    background-color: rgb(179, 58, 58);
    box-shadow: 2px 2px 2px rgb(128, 146, 204);
    width: 10vw;
    height: 4vw;
    border-radius: 1vw;
    margin: 0 auto;
    font-size: 2.5vw;
}

.u2{
    display: flex;
    justify-content: space-around;
    margin: 0 12vw 0 12vw;
}
